<template>
  <div class="menu-list">
    <div>
    <!--  <div v-for="(group, i) in menuList" :key="i" class="menu-group"> -->
	  <div  class="menu-group">
        <div class="array">
          <div
            class="item"
            v-for="(item, i) in menuList"
            :key="item.worklineId"
            @click="clickItem(item)"
          >
            <div class="item-l">
              <div>
                <div class="title">
                  <span>{{ item.worklineName }} </span>
                  <uni-icons type="forward" size="20"></uni-icons>
                </div>
                <span class="subtitle">{{ item.workshopName }}</span>
              </div>
            </div>
            <div class="item-r">
              <image class="menu-item-bg" src="" alt="" />
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      primaryColor: "#35a073",
      menuList: [
        {
          menuText: "生产执行",
          children: [
            {
              menuText: "生产报工",
              menuCode: "PRODUCTIONREPOR",
              isCollect: null,
              webUrl: "pages/index/reportProductio/index",
            },
            {
              menuText: "生产报工",
              menuCode: "PRODUCTIONREPOR1",
              isCollect: null,
            },
            {
              menuText: "生产报工",
              menuCode: "PRODUCTIONREPOR2",
              isCollect: true,
            },
            {
              menuText: "生产报工",
              menuCode: "PRODUCTIONREPOR3",
              isCollect: true,
            },
          ],
        },
      ],
	  
    };
  },
  computed: {
    // 菜单列表
    // menuList() {
    // return menuState.menuList;
    // },
    collectMenuList() {
      // return menuState.collectMenuList;
    },
  },
  mounted() {
	  // 获取所有产线
	  this.$u.api.getWorkLine().then(res=>{
	  	this.menuList=res.data;
	  })
  },
  methods: {
    clickRemoveStar({ menuCode }) {
      // canceTCoTlectMenu(menuCode);
    },
    async clickStar(item) {
      const { isCollect, menuCode } = item;
      // if (isCollect) cancelcollectMenu(menuCode);else addCollectMenu(menuCode);
    },
    clickItem(item) {
      // const { webUrl } = item;
      // localStorage.setItem("title", item.menuText);
      // uni.navigateTo(  {url:'/' + webUrl});
	  const para = item
	  uni.navigateTo({
	  	url: '/pages/index/reportProductio/index?processPara=' + JSON.stringify(para)
	  });
    },
  },
};
</script>
<style lang="scss" scoped>
.title {
  display: flex;
  align-items: center;
  //   margin-bottom: 8px;
  margin-bottom: 15px;

  .menu-r {
    height: 16px;
    width: 16px;
  }
}
.subtitle {
  font-size: 14px;
  color: #aaa;
}
.group-title {
  margin: 20px 10px;
  font-size: 18px;
  color: #333;
  font-weight: 600;
  display: flex;
  align-items: center;
}
.item-l {
  display: flex;
  align-items: center;
  flex: auto;
  margin-right: 10px;
  height: 100%;
}
.item-r {
}
.menu-item-bg {
  width: 100px;
  height: 100px;
}
.menu-list {
  max-width: 100%;
  width: 100%;
  padding: 0 10px;
}
.row-title {
  color: #999;
  font-size: 18px;
  font-weight: 500;
  margin-left: 10px;
  margin-top: 12px;
}
.array {
  display: flex;
  padding: 10px;
  flex-wrap: wrap;
  max-width: 100%;
}
.menu-icon {
  width: 20px;
  height: 20px;
}
.item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: solid 1px #999;
  box-sizing: border-box;
  //   width: 304px;
  width: 450px;
  //   height: 109px;
  height: 150px;

  padding: 10px;
  padding-left: 20px;
  border-radius: 2px;
  margin: 10px;
  color: #000;
  background: #fff;
  border: 1px solid #f0f0f0;
  border-radius: 4px;
  &:active {
    // border-color: #999;
    border-color: #22baa5;
  }
  .span {
    margin-left: 10px;
    flex: auto;
    color: #000;
    font-size: 18px;
  }
}
</style>